
let [box, content, text] = [
    document.querySelector('.box'),
    document.querySelector('.content'),
    document.querySelector('.text')
]
let [textWidth, boxWidth] = [
    text.offsetWidth,
    box.offsetWidth
]
window.onload = function checkScrollLeft() {
    // 判断文字长度是否大于盒子长度
    if (boxWidth > textWidth) { return false }
    content.innerHTML += content.innerHTML
    document.querySelector('.text').classList.add('padding')
    // 更新
    textWidth = document.querySelector('.text').offsetWidth
    toScrollLeft()
}
function toScrollLeft() {
    //  如果文字长度大于滚动条距离，则递归拖动
    if (textWidth > box.scrollLeft) {
        box.scrollLeft++
        setTimeout('toScrollLeft()', 18);
    }
    else {
        // setTimeout("fun2()",2000);
    }
}



// function showList() {
//     let xhr = new XMLHttpRequest();
//     // 发送请求，获取书籍数据
//     xhr.open('GET', `http://39.105.198.203:3001/prod/index`);
//     xhr.send();
//     xhr.onreadystatechange = function () {
//         if (this.readyState === 4) { // 检查请求是否成功 4成功 每次改变都会触发
//             let data = JSON.parse(this.responseText); // JSON 数据转化对象

//             list.innerHTML = ''; // 清空书籍列表
//             console.log(data.data.list);
//             // 生成茶列表
//             for (let i = 0; i < data.data.list.length; i++) {
//                 // 使用 data.data.list[i].tid 作为链接的 ID
//                 list.innerHTML += `<li>
//                     <a href='./detail.html?tid=${i + 1}'>
//                         <div class="liBox">
//                             <div class="ioc">
//                                 <img src=${data.data.list[i].fullSrc} alt="">
//                             </div>
//                             <div class="text">
//                                 <div class="teaName">${data.data.list[i].tname}</div>
//                                 <div class="teaPrice">¥ <span class="fontBig">${data.data.list[i].price}</span> .00</div>
//                             </div>
//                         </div>
//                     </a>
//                 </li>`;
//             }
//         }



//     }

// }

// showList();